'use strict';
import React from 'react';
import {
    View,
    Image,
    TouchableOpacity,
    StyleSheet,
} from 'react-native';

const styles = StyleSheet.create({
    container: {
        flexDirection: 'row',
        alignItems: 'center',
        justifyContent: 'space-between',
        paddingTop: 25,
        paddingRight: 8,
        position: 'absolute',
        left: 0,
        right: 0,
        top: 0,
    },
    icon25: {
        width: 20,
        height: 20,
        marginLeft: 10,
    }
});

class FixedHeader extends React.Component {
    goBack() {
        this.props.navigator.pop();
    }

    render() {
        let {
            flag,
            rightFunc,
        } = this.props;
        // let leftImage = !flag ? require('../../Image/back_icon_white.png') : require('../../Image/back_icon.png');
        // let rightImage = !flag ? require('../../Image/share_icon_white.png') : require('../../Image/share_icon.png');
        let leftImage = require('../../Image/back_icon.png');
        let rightImage = require('../../Image/share_icon.png');
        return (
            <View style={styles.container}>
                <TouchableOpacity onPress={() => this.goBack()}>
                    <Image
                        source={leftImage}
                        style={styles.icon25}
                        resizeMode={'contain'}
                    />
                </TouchableOpacity>
                <TouchableOpacity onPress={() => rightFunc()}>
                    <Image
                        source={rightImage}
                        style={styles.icon25}
                    />
                </TouchableOpacity>
            </View>
        )
    }
}

FixedHeader.propTypes = {
    flag: React.PropTypes.bool,
};

export default FixedHeader;